<template>
  <div>
    <h3>select * from wxs.ims_ewei_shop_wxapp_page where name = '我金天购物商城'</h3>
    <el-input v-model="basePage.str" type="textarea" :rows="16" />
  </div>
  <div style="margin-top: 16px">
    <el-button
      type="primary"
      :loading="loadData.analysis"
      @click="submitRepairAnalysis()"
      >解析字符串</el-button
    >
    <!-- <el-button
      type="primary"
      :loading="loadData.analysis"
      @click="submitRepairBanner()"
      :disabled="props.isDisabled"
      >从配置中更新Banner</el-button
    > -->
    <el-button
      type="primary"
      :loading="loadData.notify"
      @click="submitRepairNotify()"
      :disabled="props.isDisabled"
      >从配置中更新Notify</el-button
    >
    <el-button
      type="primary"
      :loading="loadData.quick"
      @click="submitRepairQuick()"
      :disabled="props.isDisabled"
      >从配置中更新Quick</el-button
    >
  </div>
</template>

<script setup lang="ts">
import { reactive } from 'vue';
import { actionRepairModule } from '@/apis/repair';

// props
const props = defineProps({
  isDisabled: {
    type: Boolean,
    default: false
  }
});

const loadData = reactive({
  analysis: false,
  banner: false,
  notify: false,
  quick: false
});

// 页面配置
const basePage = reactive<{ str: string; options: any }>({
  // 加密字符串
  str: '',
  options: null
});

/**
 * 解析字符串
 */
const submitRepairAnalysis = async () => {
  let tempStr = basePage.str;

  if (!tempStr) return;
  try {
    // 解密字符串
    tempStr = atob(tempStr);
    // 解密Unicode
    tempStr = decodeURIComponent(tempStr);
    // 保存一份配置项
    basePage.options = JSON.parse(tempStr);
  } catch (error) {
    console.warn('解析失败！')
    return;
  }

  basePage.str = tempStr;

  console.log('basePage', basePage);
};

/**
 * 从配置中获取数据
 */
const getDataByOptions = (propName: string) => {
  if (!basePage.options || !basePage.options.items) return null;

  console.log('basePage.options.items', basePage.options.items);

  let data = null;
  for (let i in basePage.options.items) {
    const item = basePage.options.items[i];
    if (item.id === propName) {
      data = item;
      break;
    }
  }
  return data.data;
};

// /**
//  * 从配置中更新Banner
//  */
// const submitRepairBanner = async () => {
//   const data = getDataByOptions('banner');
//   if (!data) return;

//   loadData.banner = true;

//   // 提取所有banner
//   const list = Object.keys(data)
//     .map((propName) => data[propName])
//     .map((item) => ({ url: '/upload/attachment/' + item.imgurl }));

//   // 提交数据
//   // ...
//   console.log('list', list);

//   loadData.banner = false;
// };

/**
 * 从配置中更新Notify
 */
const submitRepairNotify = async () => {
  const data = getDataByOptions('notice');
  if (!data) return;

  loadData.notify = true;

  const operateTime = `${Date.now()}`;

  // 提取所有banner
  const list = Object.keys(data)
    .map((propName) => data[propName])
    .map((item) => ({
      title: item.title,
      message: item.title,
      state: '1',
      isAlert: 0,
      createTime: operateTime
    }));

  // 提交数据
  console.log('list', list);
  try {
    await actionRepairModule('updateHomePageNotify', list);
  } catch (error) {
    console.error('submitRepairNotify', error);
  }

  loadData.notify = false;
};

// 从linkurl中获取分类id
const getCategoryIdByLinkurl = (linkurl: string) => {
  if (!linkurl) return;
  return linkurl.split('cate=')?.[1] || '';
};

/**
 * 从配置中更新Quick
 */
const submitRepairQuick = async () => {
  const data = getDataByOptions('menu');
  if (!data) return;

  loadData.quick = true;

  const operateTime = `${Date.now()}`;

  // 提取所有banner
  const list = Object.keys(data)
    .map((propName) => data[propName])
    .map((item) => ({
      title: item.text,
      cover: '/upload/attachment/' + item.imgurl,
      categoryId: getCategoryIdByLinkurl(item.linkurl) || 0,
      sort: '1',
      createTime: operateTime
    }));

  // 提交数据
  console.log('list', list);
  try {
    await actionRepairModule('updateHomePageQuick', list);
  } catch (error) {
    console.error('submitRepairQuick', error);
  }

  loadData.quick = false;
};
</script>

<style lang="scss" scoped></style>
